<%@page contentType="text/html; charset=utf-8"%>
<%@ include file="/WEB-INF/jsp/include.jsp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
  	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>用户管理</title>
	<meta http-equiv="pragma" content="no-cache" />
	<meta http-equiv="keywords" content="" />
	<meta http-equiv="description" content="" />
	<link href="${ctx}/css/main.css" rel="stylesheet" type="text/css" />
	<link href="${ctx}/js/jscalendar/skins/aqua/theme.css" rel="stylesheet" type="text/css" />
	<link rel="stylesheet" type="text/css" href="${ctx}/js/easyui/themes/default/easyui.css"/>
	<link rel="stylesheet" type="text/css" href="${ctx}/js/easyui/themes/icon.css"/>
	<style type="text/css">
		#main{
			width:80%;
		}
	</style>
	<script type="text/javascript" src="${ctx}/js/jquery-1.4.2.js"></script>
	<script type="text/javascript" src="${ctx}/js/jquery.validate.js"></script>
	<script type="text/javascript" src="${ctx}/js/jquery.metadata.js"></script>
	<script type="text/javascript" src="${ctx}/js/easyui/jquery.easyui.min.js"></script>
	<script type="text/javascript" src="${ctx}/js/jscalendar/calendar.js"></script>
	<script type="text/javascript" src="${ctx}/js/jscalendar/lang/cn_utf8.js"></script>
	<script type="text/javascript" src="${ctx}/js/jscalendar/calendar-setup.js"></script>
	<script type="text/javascript" src="${ctx}/js/common.js"></script>
	<script type="text/javascript" src="${ctx}/js/jquery.upload-1.0.2.js"></script>
	<script type="text/javascript">
		var checkUrl = "${ctx}/user/user.do?action=check";
		$(function() {
			$('#sub').removeAttr('disabled');

			$.validator.setDefaults({
				submitHandler: function(form) {
					$('#sub').attr('disabled','disabled');
					form.submit();
				},
				meta: "validate",
				ignoreTitle: true//解决与google Toolbar的冲突
			});
			
			Calendar.setup(
			    {
			      inputField  : "birthday",    // ID of the input field
			      ifFormat    : "%Y-%m-%d",   // the date format
			      button      : "birthdayTrigger",      // ID of the button
			      showsTime   : false,
			      date		  : Calendar.initNewDate(),
			      timeFormat  : "24"		      
			    }
			  );
			Calendar.setup(
			    {
			      inputField  : "entryDate",    // ID of the input field
			      ifFormat    : "%Y-%m-%d",   // the date format
			      button      : "entryDateTrigger",      // ID of the button
			      showsTime   : false,
			      date		  : Calendar.initNewDate(),
			      timeFormat  : "24"		      
			    }
			  );
			Calendar.setup(
			    {
			      inputField  : "leaveDate",    // ID of the input field
			      ifFormat    : "%Y-%m-%d",   // the date format
			      button      : "leaveDateTrigger",      // ID of the button
			      showsTime   : false,
			      date		  : Calendar.initNewDate(),
			      timeFormat  : "24"		      
			    }
			  );
			Calendar.setup(
			    {
			      inputField  : "contractBeginDate",    // ID of the input field
			      ifFormat    : "%Y-%m-%d",   // the date format
			      button      : "contractBeginDateTrigger",      // ID of the button
			      showsTime   : false,
			      date		  : Calendar.initNewDate(),
			      timeFormat  : "24"		      
			    }
			  );
			Calendar.setup(
			    {
			      inputField  : "contractEndDate",    // ID of the input field
			      ifFormat    : "%Y-%m-%d",   // the date format
			      button      : "contractEndDateTrigger",      // ID of the button
			      showsTime   : false,
			      date		  : Calendar.initNewDate(),
			      timeFormat  : "24"		      
			    }
			  );
			Calendar.setup(
			    {
			      inputField  : "regularizationDate",    // ID of the input field
			      ifFormat    : "%Y-%m-%d",   // the date format
			      button      : "regularizationDateTrigger",      // ID of the button
			      showsTime   : false,
			      date		  : Calendar.initNewDate(),
			      timeFormat  : "24"		      
			    }
			  );
			  
			$("#theform").validate({
				rules:{
					"user.username":{
						required:true,
						maxlength:64,
						minlength:4,
						rangelength:[4,64],
						remote: checkUrl
						},
					"user.password":{
							required:true,
							maxlength:64,
							minlength:6,
							rangelength:[6,16]
						},
					"conPassword":{
							required:true,
							maxlength:64,
							minlength:6,
							rangelength:[6,16],
							equalTo:"#password"
						},
					"user.opPwd":{
							required:true,
							maxlength:64,
							minlength:6,
							rangelength:[6,16]
						},
					"conOpPwd":{
							required:true,
							maxlength:64,
							minlength:6,
							rangelength:[6,16],
							equalTo:"#opPwd"
						},
					"user.name":{
						required:true,
						maxlength:8,
						minlength:2
						}

				},
				messages:{
					"user.username":{
						remote: "该用户名已被使用"
					},
					"conPassword":{
						equalTo:"两次输入密码不一致，请重新输入"
					}
					,
					"conOpPwd":{
						equalTo:"两次输入密码不一致，请重新输入"
					}
				},
				success: function(label) {
					label.addClass("valid").html("<img src='${ctx}/images/ok.gif' border='0'/>")
				},
				ignore: ".ignore"
			});
			
			$('#pic').change(function() {
	            $(this).upload('${ctx}/user/user.do?action=upload', function(res) {
	               	$('#personal_pic').attr('src', '${ctx}' + res.fileUrl);
	               	$('#pic_path').val(res.fileUrl);
	            }, 'json');
	        });
		});	
	</script>
  </head>
  <body>
  	<div id="main">
 		<c:choose>
   			<c:when test="${user.id == null}">
   			<div class="titlediv">您所在的位置：用户管理->用户添加</div>
   			</c:when>
   			<c:otherwise>
   			<div class="titlediv">您所在的位置：用户管理->用户修改</div>
   			</c:otherwise>
   		</c:choose>  	
    	<div id="content" class="margin_10">
    	<div><center><span class="red">${errorMessage}</span></center></div>
    	<div><center><span>上传照片：<input type="file" id="pic" name="pic" /></span></center></div>
    	<div><center><img id="personal_pic" src="${ctx}${user.picPath}" width="120" height="160" /></center></div>
    	<form id="theform" action="${ctx}/user/user.do" method="post">
    		<input type="hidden" name="action" value="manage"/>
    		<input type="hidden" name="user.id" value="${user.id}"/>
            <input id="page" name="page" type="hidden" value="${page}" />
            <input type="hidden" name="username" value="${username}" />
            <input type="hidden" name="name" value="${name}" />
            <input id="queryEnabledValue" name="queryEnabledValue" type="hidden" value="${queryEnabledValue}" />
    		<input id="pic_path" type="hidden" name="user.picPath" value="${user.picPath}"/>
    		<div id="form">
	    		<table cellpadding="0" cellspacing="0" border="0" style="width:50%" class="querytab">
	    			<tr>
	    			<c:choose>
		    			<c:when test="${user.id == null}">
		    			<td class="alignright"><span class="red spanmargin">*</span><span>用户名：</span></td><td class="alignleft"><input type="text" name="user.username" maxlength="16" value="${user.username}" /></td>
		    			</c:when>
		    			<c:otherwise>
		    			<td class="alignright">用户名：</td><td class="alignleft">${user.username}<input type="hidden" name="user.username" value="${user.username}" class="ignore" /></td>
		    			</c:otherwise>
		    		</c:choose>
		    		</tr>
				    <c:if test="${user.id == null}">
					    <tr><td class="alignright"><span class="red spanmargin">*</span><span>密码：</span></td><td class="alignleft"><input id="password" type="password" name="user.password" maxlength="16"/></td></tr>
					    <tr><td class="alignright"><span class="red spanmargin">*</span><span>确认密码：</span></td><td class="alignleft"><input type="password" name="conPassword" maxlength="16"/></td></tr>
					    <tr><td class="alignright"><span>二次认证密码：</span></td><td class="alignleft"><input id="opPwd" type="password" name="user.opPwd" maxlength="16"/></td></tr>
					    <tr><td class="alignright"><span>确认二次认证密码：</span></td><td class="alignleft"><input type="password" name="conOpPwd" maxlength="16"/></td></tr>
					    <tr>
						    <td class="alignright"><span>用户角色：</span></td><td class="alignleft">
						    <s:select list="roles" listKey="id" listValue="name" name="roleId" value="%{user.educationDegree.value}"></s:select>
					    </td>
					    </tr>
				    </c:if>
		    		<tr><td class="alignright"><span class="red spanmargin">*</span><span>姓名：</span></td><td class="alignleft"><input type="text" name="user.name" value="${user.name}"  maxlength="8"/></td></tr>
		    		<tr><td class="alignright"><span>手机：</span></td><td class="alignleft"><input type="text" name="user.mobile" value="${user.mobile}" /></td></tr>
		    		<tr><td class="alignright"><span>电话：</span></td><td class="alignleft"><input type="text" name="user.tel" value="${user.tel}" /></td></tr>
		    		<tr><td class="alignright"><span>邮件：</span></td><td class="alignleft"><input type="text" name="user.email" value="${user.email}" /></td></tr>
		    		<tr><td class="alignright"><span>QQ：</span></td><td class="alignleft"><input type="text" name="user.qq" value="${user.qq}" /></td></tr>
		    		<tr><td class="alignright"><span>新浪微博：</span></td><td class="alignleft"><input type="text" name="user.weibo" value="${user.weibo}" /></td></tr>
		    		<tr><td class="alignright"><span>出生日期：</span></td><td class="alignleft"><input type="text" id="birthday" name="user.birthday" size="20" value="<fmt:formatDate value='${user.birthday}' pattern='yyyy-MM-dd'/>" readonly="readonly"/><input type="button" id="birthdayTrigger" value="选择"/></td></tr>
		    		<tr>
		    			<td class="alignright"><span>性别：</span></td><td class="alignleft"><s:radio list="sexTypeList" listKey="value" listValue="name" name="sexTypeValue" value="%{user.sex.value}"></s:radio></td>
		    		</tr>
		    		<tr><td class="alignright"><span>民族：</span></td><td class="alignleft"><input type="text" name="user.nation" value="${user.nation}" /></td></tr>
		    		<tr><td class="alignright"><span>入职日期：</span></td><td class="alignleft"><input type="text" id="entryDate" name="user.entryDate" size="20" value="<fmt:formatDate value='${user.entryDate}' pattern='yyyy-MM-dd'/>" readonly="readonly"/><input type="button" id="entryDateTrigger" value="选择"/></td></tr>
		    		<tr><td class="alignright"><span>离职日期：</span></td><td class="alignleft"><input type="text" id="leaveDate" name="user.leaveDate" size="20" value="<fmt:formatDate value='${user.leaveDate}' pattern='yyyy-MM-dd'/>" readonly="readonly"/><input type="button" id="leaveDateTrigger" value="选择"/></td></tr>
		    		<tr><td class="alignright"><span>合同签订时间：</span></td><td class="alignleft"><input type="text" id="contractBeginDate" name="user.contractBeginDate" size="20" value="<fmt:formatDate value='${user.contractBeginDate}' pattern='yyyy-MM-dd'/>" readonly="readonly"/><input type="button" id="contractBeginDateTrigger" value="选择"/></td></tr>
		    		<tr><td class="alignright"><span>合同到期时间：</span></td><td class="alignleft"><input type="text" id="contractEndDate" name="user.contractEndDate" size="20" value="<fmt:formatDate value='${user.contractEndDate}' pattern='yyyy-MM-dd'/>" readonly="readonly"/><input type="button" id="contractEndDateTrigger" value="选择"/></td></tr>
		    		<tr><td class="alignright"><span>转正日期：</span></td><td class="alignleft"><input type="text" id="regularizationDate" name="user.regularizationDate" size="20" value="<fmt:formatDate value='${user.regularizationDate}' pattern='yyyy-MM-dd'/>" readonly="readonly"/><input type="button" id="regularizationDateTrigger" value="选择"/></td></tr>
		    		<tr>
		    			<td class="alignright"><span>学历：</span></td><td class="alignleft"><s:select list="educationDegreeTypeList" listKey="value" listValue="name" name="educationDegreeValue" value="%{user.educationDegree.value}"></s:select></td>
		    		</tr>
		    		<tr><td class="alignright"><span>毕业院校：</span></td><td class="alignleft"><input type="text" name="user.university" value="${user.university}" /></td></tr>
		    		<tr>
		    			<td class="alignright"><span>婚姻状况：</span></td><td class="alignleft"><s:radio list="maritalStatusList" listKey="value" listValue="name" name="maritalStatusValue" value="%{user.maritalStatus.value}"></s:radio></td>
		    		</tr>
		    		<tr>
		    			<td class="alignright"><span>是否有效：</span></td><td class="alignleft"><s:radio list="enabledStatusList" listKey="value" listValue="name" name="enabledValue" value="%{user.enabled.value}"></s:radio></td>
		    		</tr>
		    		<tr><td class="alignright"><span>备注：</span></td><td class="alignleft"><textarea name="user.memo" cols="30" rows="5">${user.memo}</textarea></td></tr>
		    		<tr><td class="alignright"><span>用户ip：</span></td><td class="alignleft"><textarea name="user.clientIp" cols="30" rows="5">${user.clientIp}</textarea></td></tr>
		    		<tr><td class="alignright"><span>资源ip：</span></td><td class="alignleft"><textarea name="user.resourceIp" cols="30" rows="5">${user.resourceIp}</textarea></td></tr>
	    		</table>
    		</div>
    		<div id="foot"><center><input id="sub" type="submit" value="提交 "/></center></div>
    		<div class="margin_10"><center><a href="javascript:history.back()" class="easyui-linkbutton" iconCls="icon-reload">返回列表</a></center></div>
    	</form>
    	</div>
    </div>
  </body>
</html>
